<template>
  <div class="product">
      <p class="money">￥<span>11111</span></p>
      <p class="productname">vdaebttnynvytjvjtjjcyty</p>
      <p class="productdes">
          <span>推荐理由</span>
          <span>销量<span>10万+</span></span>
          <b>
              <span>①&nbsp;&nbsp;revbbvne</span>
              <span>②&nbsp;&nbsp;vrewnn</span>
              <span>③&nbsp;&nbsp;vrewi</span>
          </b>
      </p>
  </div>
</template>

<script>
export default {
  name: "Product",
  data() {
    return {};
  }
//   created () {
//       axios({
//         url:"/posts",
//         method:"get",
//         data:{
//             name:this.name,
//             pass:this.pass,
//             sex:this.sex
//         },
//         baseURL:"http://localhost:3000"                
//         })
//         .then(res=>console.log(res.data))
//   }
};
</script>

<style scoped>
    .product{
        width: 3.47rem;
        margin: auto;
    }
    .money{
        width: 100%;
        height: 0.38rem;
        color: red;
        font-size: 0.16rem;
        line-height: 0.38rem;
    }
    .money>span{
        font-size: 0.2rem;
    }
    .productname{
        width: 100%;
        height: 0.35rem;
        font-size: 0.16rem;
        line-height: 0.36rem;
    }
    .productdes{
        font-size: 0.12rem;
        margin-top: 0.1rem;
    }
    .productdes>span:nth-child(2){
        float: right;
    }
    .productdes>span:nth-child(2)>span{
        color: red;
    }
    .productdes>b{
        display: block;
        background-color:#ecebeb;
        margin-top: 0.05rem;
        border-radius: 0.05rem;
        overflow: hidden;
    }
    .productdes>b>span{
        display: block;
        height: 0.22rem;
        line-height: 0.22rem;
        font-size: 0.12rem;
        color: gray;
        text-indent: 0.1rem;
    }
    .productdes>b>span:nth-child(1){
        margin-top: 0.05rem;
    }
    .productdes>b>span:last-child{
         margin-bottom: 0.05rem;   
    }
</style>